<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<jsp:include page="/WEB-INF/jsp/head.jsp" />

<script type="text/javascript">

	var mapDiv = "#mapDiv";
	var message = "${message}";
	
	$(document).ready(
			function() {
				//Seta os valores iniciais de DataInicio e Data Fim
				$("#dataInicial").val("${datIni}");
				$("#dataFinal").val("${datFim}");
			
				//define titulo da pagina
				$("#divTitle").html("Análise por Região");
				
				////carga de dados para plotar no gráfico
				//locations = "${locations}";	//jSon
				locations = [${locations}];
				
				drawingMap();
				//alert(locations);
				$("#btnUS17").click(function(){					
					drawingMap();
				});

				
			});
	
	function drawingMap(){
		ClearDiv();	
		var myLatlng = new google.maps.LatLng(-23.55940720, -46.65842190);
		mapMarkerUS17(mapDiv, myLatlng, locations, 6);
		identifyTypes(locations);
		
		if (message.length>0){alert(message);}
	}
</script>

</head>
<body>
	<jsp:include page="/WEB-INF/jsp/cabecalhoScaf.jsp" />
	<form method="POST">
		<jsp:include page="/WEB-INF/jsp/common/RangeDatas.jsp" />
		<div class="linha" />
		<input type="submit" value="Pesquisar">
		<!-- 		<input type="button" id="btnUS17" value="US17"> -->

	</form>
	<table>
	
		<tr>
			<td><div id="mapDiv"
					style="width: 800px; height: 400px; background-color: #dcdcdc;"></div></td>
			<td><div id="listTypes"></div></td>
		</tr>
	</table>
</body>
</html>